<template>
  <div class="updataMy">
    <mt-header fixed>
      <router-link to="/my_person" slot="left">
        <mt-button icon="back">返回</mt-button>
      </router-link>
    </mt-header>
    <div class="main">
      <mt-field label="性别" placeholder="请输入性别" v-model="sex"></mt-field>
      <mt-field label="QQ" placeholder="请输入QQ号" v-model="QQ"></mt-field>
      <mt-field label="邮箱" type="email" placeholder="请输入邮箱" v-model="email"></mt-field>
      <mt-field label="手机号" type="tel" placeholder="请输入手机号" v-model="phone"></mt-field>
      <mt-field label="生日" type="date" placeholder="请输入生日" v-model="birthday"></mt-field>
      <mt-field label="所在城市" placeholder="请输入所在城市" v-model="city"></mt-field>
    </div>
    <mt-button class="btn" type="danger" size="large" @click="upClick()">确认修改</mt-button>
  </div>
</template>

<script>
import { Field, Toast } from 'mint-ui';
import { getAllMessage, updataMy } from '../services/product_type';
import cookie from 'js-cookie';

export default {
  name: "updataMy",
  data() {
    return {
      sex: '',
      QQ: '',
      email: '',
      phone: '',
      birthday: '',
      city: '',
    }
  },
  created() {
    getAllMessage({
      userName: cookie.get('userName'),
    }).then(res => {
      this.sex = res.data.info[0].sex;
      this.QQ = res.data.info[0].QQ;
      this.email = res.data.info[0].email;
      this.phone = res.data.info[0].phone;
      this.birthday = res.data.info[0].birthday;
      this.city = res.data.info[0].city;
    }).catch(err => {
      console.log(err);
    })
  },
  methods: {
    upClick() {
      updataMy({
        userName: cookie.get('userName'),
        sex: this.sex,
        QQ: this.QQ,
        email: this.email,
        phone: this.phone,
        birthday: this.birthday,
        city: this.city,
      }).then(res => {
        console.log(res);
        if (res.data.status == 'Y') {
          Toast({
          message: res.data.msg,
          position: 'middle',
          duration: 2000
          });
          cookie.set('sex',this.sex);
          this.$router.push({ name: 'mp'})
        }
      }).catch(err => {
        console.log(err);
      })
    }
  }
}
</script>
<style scoped>
.main{
  position: relative;
  top: 50px;
}
.btn{
  position: relative;
  margin-top: 100px;
}
</style>

